Newer
Older
pixi.js / examples / example 3 - MovieClip / index.html
@Mat Groves Mat Groves on 29 Jun 2013 2 KB Linked List update
<!DOCTYPE HTML>
<html>
<head>
	<title>pixi.js example 3 using a movieclip</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #000000;
		}
	</style>
	<script src="pixi.js"></script>
	<script src="../../src/pixi/renderers/webgl/WebGLRenderGroup.js"></script>


</head>
<body>
	<script>

	// create an array of assets to load
	var assetsToLoader = [ "SpriteSheet.json"];
	
	// create a new loader
	loader = new PIXI.AssetLoader(assetsToLoader);
	
	// use callback
	loader.onComplete = onAssetsLoaded
	
	//begin load
	loader.load();
	
	
	// holder to store aliens
	var explosions = [];
	
	var count = 0;
		
	// create an new instance of a pixi stage
	var stage = new PIXI.Stage(0xFFFFFF, true);;
	
	// create a renderer instance.
	renderer = new PIXI.CanvasRenderer(800, 600);
		
	// add the renderer view element to the DOM
	document.body.appendChild(renderer.view);
	
	function onAssetsLoaded()
	{
		// create an array to store the textures
		var explosionTextures = [];
		
		for (var i=0; i < 26; i++) 
		{
		 	var texture = PIXI.Texture.fromFrame("Explosion_Sequence_A " + (i+1) + ".png");
		 	explosionTextures.push(texture);
		};
		
		// create a texture from an image path
		// add a bunch of aliens
		for (var i = 0; i < 2; i++) 
		{
			// create an explosion MovieClip
			var explosion = new PIXI.MovieClip(explosionTextures);
			
			var container  = new PIXI.DisplayObjectContainer();
			
			explosion.position.x = Math.random() * 800;
			explosion.position.y = Math.random() * 600;
			explosion.anchor.x = 0.5;
			explosion.anchor.y = 0.5;
			
			explosion.rotation = Math.random() * Math.PI;
			explosion.scale.x = explosion.scale.y = 0.75 + Math.random() * 0.5
			
			explosion.gotoAndPlay(Math.random() * 27);
			explosion.interactive = true;
			
			stage.addChild(explosion);
			//stage.addChild(container);
			
			
			explosion.click = function()
			{
				this.alpha = 0.3;
				
				this.addFilter();
				//this.parent.addChildAt(this, 4);
				onRemove();
			}
			
			if(i == 0)
			{
				//runList(container);
			}
		}
		
		
		// start animating
		requestAnimFrame( animate );
		
		runList(stage)
	}	
	
	function runList(item)
	{
		console.log(">>>>>>>>>")
		console.log("_")
		var safe = 0;
		var tmp = item;
		console.log(tmp);
		
		while(tmp._iNext)
		{
			safe++;
	//		console.log(tmp.childIndex + tmp);
			tmp = tmp._iNext;
			console.log(tmp);//.childIndex);
		//	console.log(tmp);
		
			if(safe > 100)
			{
				console.log("BREAK")
				break
			}
		}	
	}
	
	function onRemove()
	{
		runList(stage)
	}
	
	function animate() {
	    requestAnimFrame( animate );

	    renderer.render(stage);
	}

	</script>

	</body>
</html>